import Vue from 'vue'
import VueRouter from 'vue-router'

import Home from '../views/Home.vue'
import layout from "../layout/"

Vue.use(VueRouter)

const routes = [
  {
    path: '/',
    name: 'Home',
    component: layout
  },
  // 基础
  {
    path: '/base',
    component: layout,
    children: [
      {
        name: 'SceneCreate',
        path: 'sceneCreate',
        component: () => import(/* webpackChunkName: "Base" */ '../views/base/scene-create'),
        meta: { title: '场景创建' }
      }
    ],
    meta: { title: '基础' }
  },
  // 灯光
  {
    path: '/light',
    component: layout,
    children: [
      {
        path: 'ambient',
        name: 'Ambient',
        component: () => import(/* webpackChunkName: "Light" */ '../views/light/ambient-light'),
        meta: { title: '环境光' }
      },
      {
        path: 'directional',
        name: 'Directional',
        component: () => import(/* webpackChunkName: "Light" */ '../views/light/directional-light'),
        meta: { title: '平行光' }
      },
      {
        path: 'point',
        name: 'Point',
        component: () => import(/* webpackChunkName: "Light" */ '../views/light/point-light'),
        meta: { title: '点光源' }
      },
      {
        path: 'spot',
        name: 'Spot',
        component: () => import(/* webpackChunkName: "Light" */ '../views/light/spot-light'),
        meta: { title: '聚光灯' }
      }
    ],
    meta: { title: '灯光' }
  },
  // 相机
  {
    path: '/camera',
    component: layout,
    children: [
      {
        name: 'orthographic',
        path: 'orthographic',
        component: () => import(/* webpackChunkName: "Camera" */ '../views/camera/orthographic-camera'),
        meta: { title: '正交相机' }
      },
      {
        name: 'Perspective',
        path: 'perspective',
        component: () => import(/* webpackChunkName: "Camera" */ '../views/camera/perspective-camera'),
        meta: { title: '透视相机' }
      },
      {
        name: 'Contrast',
        path: 'contrast',
        component: () => import(/* webpackChunkName: "Camera" */ '../views/camera/contrast'),
        meta: { title: '相机对比' }
      }
    ],
    meta: { title: '相机' }
  },
  //材质
  {
    path: '/material',
    component: layout,
    children: [
      {
        path: 'meshBasic',
        name: 'MeshBasic',
        component: () => import(/* webpackChunkName: "Material" */ '../views/material/mesh-basic-material'),
        meta: { title: '网格基础材质' }
      },
      {
        path: 'meshDepth',
        name: 'MeshDepth',
        component: () => import(/* webpackChunkName: "Material" */ '../views/material/mesh-depth-material'),
        meta: { title: '网格深度材质' }
      },
      {
        path: 'multi',
        name: 'Multi',
        component: () => import(/* webpackChunkName: "Material" */ '../views/material/multi-material'),
        meta: { title: '联合材质' }
      },
      {
        path: 'meshNormal',
        name: 'MeshNormal',
        component: () => import(/* webpackChunkName: "Material" */ '../views/material/mesh-normal-material'),
        meta: { title: '法向量材质' }
      },
      {
        path: 'differentFaces',
        name: 'DifferentFaces',
        component: () => import(/* webpackChunkName: "Material" */ '../views/material/different-faces'),
        meta: { title: '不同面材质' }
      },
      {
        path: 'meshLambert',
        name: 'MeshLambert',
        component: () => import(/* webpackChunkName: "Material" */ '../views/material/mesh-lambert-material'),
        meta: { title: 'Lambert网格材质' }
      },
      {
        path: 'meshPhong',
        name: 'MeshPhong',
        component: () => import(/* webpackChunkName: "Material" */ '../views/material/mesh-phong-material'),
        meta: { title: 'Phong网格材质' }
      },
      {
        path: 'shader',
        name: 'Shader',
        component: () => import(/* webpackChunkName: "Material" */ '../views/material/shader-material'),
        meta: { title: '着色器材质' }
      },
      {
        path: 'lineBasic',
        name: 'LineBasic',
        component: () => import(/* webpackChunkName: "Material" */ '../views/material/line-basic-material'),
        meta: { title: '基础线条材质' }
      },
      {
        path: 'lineDashed',
        name: 'LineDashed',
        component: () => import(/* webpackChunkName: "Material" */ '../views/material/line-dashed-material'),
        meta: { title: '虚线材质' }
      }
    ],
    meta: { title: '材质' }
  },
  // 几何体 二维
  {
    path: '/geometry2D',
    component: layout,
    children: [
      {
        path: 'plane',
        name: 'Plane',
        component: () => import(/* webpackChunkName: "Geometry2D" */ '../views/geometry-2D/plane-geometry'),
        meta: { title: '二维平面' }
      },
      {
        path: 'circle',
        name: 'Circle',
        component: () => import(/* webpackChunkName: "Geometry2D" */ '../views/geometry-2D/circle-geometry'),
        meta: { title: '圆形几何体' }
      },
      {
        path: 'shape',
        name: 'Shape',
        component: () => import(/* webpackChunkName: "Geometry2D" */ '../views/geometry-2D/shape-geometry'),
        meta: { title: '自定义二维图形' }
      },
      {
        path: 'sprite',
        name: 'Sprite',
        component: () => import(/* webpackChunkName: "Geometry2D" */ '../views/geometry-2D/sprite'),
        meta: { title: '精灵sprite' }
      }
    ],
    meta: { title: '几何体二维' }
  },
  // 几何体 三维
  {
    path: '/geometry3D',
    component: layout,
    children: [
      {
        path: 'box',
        name: 'Box',
        component: () => import(/* webpackChunkName: "Geometry3D" */ '../views/geometry-3D/box-geometry'),
        meta: { title: '三维立方体' }
      },
      {
        path: 'sphere',
        name: 'Sphere',
        component: () => import(/* webpackChunkName: "Geometry3D" */ '../views/geometry-3D/sphere-geometry'),
        meta: { title: '三维球体' }
      },
      {
        path: 'cylinder',
        name: 'Cylinder',
        component: () => import(/* webpackChunkName: "Geometry3D" */ '../views/geometry-3D/cylinder-geometry'),
        meta: { title: '三维圆柱' }
      }
    ],
    meta: { title: '几何体三维' }
  },
  // 高级几何体
  {
    path: '/advancedGeometry',
    component: layout,
    children: [
      {
        name: 'ExtrudeGeometry',
        path: 'extrudeGeometry',
        component: () => import(/* webpackChunkName: "AdvancedGeometry" */ '../views/advanced-geometry/extrude-geometry'),
        meta: { title: '拉伸体' }
      },
      {
        name: 'LatheGeometry',
        path: 'latheGeometry',
        component: () => import(/* webpackChunkName: "AdvancedGeometry" */ '../views/advanced-geometry/lathe-geometry'),
        meta: { title: '扫描体' }
      }
    ],
    meta: { title: '高级几何体' }
  },
  // 纹理
  {
    path: '/texture',
    component: layout,
    children: [
      {
        path: 'imageTexture',
        name: 'ImageTexture',
        component: () => import(/* webpackChunkName: "texture" */ '../views/texture/image-texture'),
        meta: { title: '图片纹理' }
      },
      {
        path: 'videoTexture',
        name: 'VideoTexture',
        component: () => import(/* webpackChunkName: "texture" */ '../views/texture/video-texture'),
        meta: { title: '视频纹理' }
      },
    ],
    meta: { title: '纹理' }
  },
  //粒子
  {
    path: '/particle',
    component: layout,
    children: [
      {
        name: 'Raindrop',
        path: 'raindrop',
        component: () => import(/* webpackChunkName: "Particle" */ '../views/particle/texture-raindrop'),
        meta: { title: '雨滴特效' }
      }
    ],
    meta: { title: '粒子' }
  },
  // 交互操作
  {
    path: '/interactive',
    component: layout,
    children: [
      {
        path: 'changeFace',
        name: 'ChangeFace',
        component: () => import(/* webpackChunkName: "interactive" */ '../views/interactive/click-change-face'),
        meta: { title: '点击判断选中面' }
      },
      {
        path: 'selectedProfile',
        name: 'SelectedProfile',
        component: () => import(/* webpackChunkName: "interactive" */ '../views/interactive/selected-profile'),
        meta: { title: '鼠标选中轮廓' }
      },
      {
        path: 'infoWindow',
        name: 'InfoWindow',
        component: () => import(/* webpackChunkName: "interactive" */ '../views/interactive/info-window'),
        meta: { title: '信息提示窗' }
      },
      {
        path: 'rightClickOperate',
        name: 'RightClickOperate',
        component: () => import(/* webpackChunkName: "interactive" */ '../views/interactive/right-click-operate'),
        meta: { title: '右键操作' }
      }
    ],
    meta: { title: '交互操作' }
  },
  // 后期操作
  {
    path: '/postProcessing',
    component: layout,
    children: [
      {
        path: 'unrealBloomPass',
        name: 'UnrealBloomPass',
        component: () => import(/* webpackChunkName: "postProcessing" */ '../views/post-processing/UnrealBloomPass'),
        meta: { title: 'UnrealBloomPass' }
      },
    ],
    meta: { title: '后期处理' }
  },
  // 特殊效果
  {
    path: '/special',
    component: layout,
    children: [
      // 天空盒
      {
        path: 'skyBox',
        name: 'SkyBox',
        component: () => import(/* webpackChunkName: "special" */ '../views/sky-box/'),
        meta: { title: '天空盒' }
      },
      // 扩散圆
      {
        path: 'ring',
        name: 'Ring',
        component: () => import(/* webpackChunkName: "special" */ '../views/ring/'),
        meta: { title: '扩散圆' }
      },
      // 扩散墙
      {
        path: 'wall',
        name: 'Wall',
        component: () => import(/* webpackChunkName: "special" */ '../views/wall/'),
        meta: { title: '扩散墙' }
      },
    ],
    meta: {
      title: '特殊效果'
    }
  },
  // 加载模型
  {
    path: '/model',
    component: layout,
    children: [
      {
        path: 'loadGltf',
        name: 'LoadGltf',
        component: () => import(/* webpackChunkName: "model" */ '../views/load-model/gltf-model'),
        meta: { title: '加载gltf模型' }
      },
      {
        path: 'loadObj',
        name: 'LoadObj',
        component: () => import(/* webpackChunkName: "model" */ '../views/load-model/obj-model'),
        meta: { title: '加载obj模型' }
      },
    ],
    meta: { title: '模型' }
  },
  // tween 动画
  {
    path: '/tween',
    component: layout,
    children: [
      {
        path: 'rotate',
        name: 'Rotate',
        component: () => import(/* webpackChunkName: "tween" */ '../views/tween/rotate-group'),
        meta: { title: '旋转' }
      }
    ],
    meta: { title: 'Tween' }
  }
]

const router = new VueRouter({
  routes
})

export default router
